<template>
	<view class="container">
		<image class="logo" :src="clientInfo.logo" mode="aspectFit"></image>
		<!-- #ifndef APP-PLUS -->
		<view class="loginWayView">
			<button v-if="!readmeActive" @click="readmeTap" class="wxLogin" style="background-color: #DD4949;">手机号快捷登录</button>
			<button v-if="readmeActive" open-type='getPhoneNumber' @getphonenumber="getPhoneNumber" class="wxLogin" style="background-color: #DD4949;">手机号快捷登录</button>
		</view>
		<!-- <view class="loginWayView">
			<button @click="authLoginTap" class="wxLogin" style="background-color: #DD4949;">快捷登录</button>
		</view> -->
		<view style="color: #666666;margin-top: 40rpx;" @click="accountLogin">
			账号密码登录
		</view>
		<!-- #endif -->
		<view class="readme" v-if="pageConfig.isShow2">
			<view class="left" @tap="read">
				<view :class="readmeActive?'':'no'"></view>
			</view>
			<view class="right">我已阅读并且同意<text @tap="goXY">《{{pageConfig.text1}}》</text></view>
		</view>
		<authInfoPopup ref='authInfoPopup' :isShow='isShowAuthInfoPopup' @confim='confirmAuthInfo'></authInfoPopup>
	</view>
</template>

<script>
	import {
		user
	} from '@/api/user.js'
	import {
		common
	} from "@/api/common.js";
	import {
		page
	} from '@/api/page.js'
	import {
		config
	} from "@/api/config.js";
	import { authInfoPopup } from '@/pages/login/components/authInfoPopup.vue'
	export default {
		components: {
			authInfoPopup
		},
		data() {
			return {
				pageConfig: {},
				readmeActive: true,
				key: "",
				code: '',
				userInfo: {},
				clientInfo: {},
				isShowAuthInfoPopup: false,
			}
		},
		onLoad(option) {
			// #ifndef APP-PLUS
			this.getCode()
			// #endif
		},
		onShow() {
			this.clientInfo = this.$storage.getStorageDataSync(this.$store.state.clientname)
		},
		methods: {
			// 微信授权登录
			wxLoginAction(){
				// this.storageMiniProOpenId()
				uni.login({
					provider: 'weixin',
					scopes: 'auth_base',
					success: function (loginRes) {
						console.log('loginRes', loginRes)
						// common.getOpenId({code: loginRes.code}).then(res => {
						// 	if(res.data.data.openid){
						// 		_this.$storage.setStorageDataSync("OPENID", res.data.data.openid)
						// 	}
						// })
				   },
				})
				
				
				var that = this
				uni.getUserProfile({
					desc: '完善用户信息',
					success: function(res) {
						// that.code = loginRes.code
						console.log('res：', res)
						that.wxLogin(res)
					},
				})
			},
			// 快捷登录
			authLoginTap(){
				// this.$refs.authInfoPopup.show()
				user.wxLoginForOpenid({
					"code": this.code,
				}).then(res => {
					if (res.data.code == 10000) {
						this.$storage.setStorageDataSync(this.$store.state.token, res.data.data.token)
						// 获取并缓存openId
						this.storageMiniProOpenId()
						this.getUserInfo()
					} else if(res.data.code == 10001) {
						uni.showModal({
							content: 'code失效，请返回重试',
							confirmText: '确定',
							showCancel: false,
							success(_res) {
								if(_res.confirm){
									uni.navigateBack()
								}
							}
						})
					}else if(res.data.code == 10002) {
						uni.showModal({
							content: '请先通过邀请码注册',
							confirmText: '确定',
							showCancel: false,
							success(_res) {
								if(_res.confirm){
									uni.navigateBack()
								}
							}
						})
					}
				})
			},
			confirmAuthInfo(e){
				console.log('e', e)
			},
			accountLogin(){
				var that = this
				this.$Router.replace({
					name: 'login',
					params: that.$Route.query
				})
			},
			getCode() {
				var that = this
				uni.login({
					provider: uni.getProvider,
					success: function(loginRes) {
						that.code = loginRes.code
						console.log('code：', loginRes.code)
					},
				})
			},
			//获取授权手机号
			getPhoneNumber(e) {
				if (e.detail.errMsg == "getPhoneNumber:ok") {
					console.log("手机号授权成功", e)
					this.checkSession(e.detail)
				} else {
					uni.showModal({
						title: '授权失败',
						content: "",
						confirmText: "确定",
						showCancel: false
					})
				}
			},
			//检查在线状态
			checkSession(data) {
				var that = this
				uni.checkSession({
					success() {
						that.wxLogin(data)
					},
					fail() {
						uni.login({
							provider: 'weixin',
							success: function(loginRes) {
								console.log('wxLoginSuccess', loginRes);
								that.code = loginRes.code
								that.wxLogin(data)
							},
						})
					}
				})
			},
			wxLogin(data) {
				var sceneConfig = getApp().globalData.sceneConfig?getApp().globalData.sceneConfig:{}
				var that = this
				user.wxLogin({
					"code": this.code,
					"encryptedData": data.encryptedData,
					"iv": data.iv,
					"parent": sceneConfig.parent ? sceneConfig.parent : '',
					"dept": sceneConfig.dept ? sceneConfig.dept : ''
				}).then(res => {
					if (res.data.code == 10000) {
						this.$storage.setStorageDataSync(this.$store.state.token, res.data.data.token)
						// 获取并缓存openId
						this.storageMiniProOpenId()
						//登录成功之后，延迟0.5秒返回（延迟5秒为解决苹果手机概率出现界面返回了，但是授权弹窗未关闭的问题）
						// if(this.$Route.query.toPath){
						// 	this.$Router.replace({
						// 		name: this.$Route.query.toPath,
						// 		params: this.$Route.query.toParams
						// 	})
						// }else if(this.$Route.query.toFullPath){
						// 	console.log('toFullPath', this.$Route.query.toFullPath)
						// 	uni.redirectTo({
						// 		url: this.$Route.query.toFullPath
						// 	})
						// }else{					
						// 	setTimeout(() => {
						// 		uni.navigateBack()
						// 	},300) 
						// }
						this.getUserInfo()
					} else if(res.data.code == 10001) {
						uni.showModal({
							content: 'code失效，请返回重试',
							confirmText: '确定',
							showCancel: false,
							success(_res) {
								if(_res.confirm){
									uni.navigateBack()
								}
							}
						})
					}else if(res.data.code == 10002) {
						uni.showModal({
							content: '请先通过邀请码注册',
							confirmText: '确定',
							showCancel: false,
							success(_res) {
								if(_res.confirm){
									uni.navigateBack()
								}
							}
						})
					}
				})

			},
			// 获取openId
			storageMiniProOpenId(){
				var _this = this
				// #ifdef MP-WEIXIN
				//登录成功之后，进行微信授权登录，并向后台获取openId，且缓存到本地
				uni.login({
					provider: 'weixin',
					scopes: 'auth_base',
					success: function (loginRes) {
						common.getOpenId({code: loginRes.code}).then(res => {
							if(res.data.data.openid){
								_this.$storage.setStorageDataSync("OPENID", res.data.data.openid)
							}
						})
				   },
				})
				// #endif
				// #ifdef MP-ALIPAY
				uni.login({
					provider: 'alipay',
					scopes: 'auth_base',
					success: function (loginRes) {
						common.getOpenId({code: loginRes.code}).then(res => {
							// if(res.data.data.openid){
							if(res.data.data.aliUserId){
								_this.$storage.setStorageDataSync("OPENID",res.data.data.aliUserId)
							}
						})
				   },
				})
				// #endif
			},
			getUserInfo(){
				user.getUserInfo().then(res => {
					if (res.data.code == 10000) {
						this.$storage.setStorageDataSync(this.$store.state.userInfo, res.data.data)
						if(this.$Route.query.toName){
							console.log('this.$Route.query', this.$Route.query)
							this.$Router.replace({
								name: this.$Route.query.toName,
								params: this.$Route.query.query
							})
						}else{
							uni.navigateBack()
						}
					}
				})
			},
			//提示先阅读服务协议
			readmeTap(){
				uni.showModal({
					content: '请先阅读并同意软件服务协议',
					confirmText: '确定',
					showCancel: false
				})
			},
			//跳转到服务协议
			goXY(){
				this.$Router.push({
					name: 'protocolView',
					params:{
						content: this.pageConfig.longtext
					}
				})
			},
			//已阅读服务协议
			read(){
				this.readmeActive = !this.readmeActive
			},
		},
	}
</script>

<style lang="scss" scoped>
	.container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;

		.logo {
			width: 200rpx;
			height: 200rpx;
			margin-top: 200rpx;
			border-radius: 20rpx;
		}
		.readme{
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 200upx;
			.left{
				width: 21upx;
				height: 21upx;
				background-color: #fff;
				border-radius: 50%;
				border: 1px solid #d4a781;
				margin-right: 19upx;
				display: flex;
				align-items: center;
				justify-content: center;
				view{
					width: 12upx;
					height: 12upx;
					border-radius: 50%;
					background-color: #d4a781;
				}
				.no{
					background-color: #FFF;
				}
			}
			.right{
				font-size: 26rpx;
				color: #999;
				text{
					color: #d4a781;
				}
			}
		}
	}

	

	.loginWayView {
		margin-top: 80rpx;
		display: flex;
		flex-direction: column;
	}

	.loginWayView .otherLogWay {
		text-align: center;
		font-size: 32rpx;
		font-weight: bold;
	}

	.wxLogin {
		width: 600rpx;
		height: 88rpx;
		color: #FFFFFF;
		font-size: 30rpx;
		border-radius: 20rpx;
		text-align: center;
		line-height: 88rpx;
		margin-top: 120rpx;
	}

	button::after {
		border: 1px solid rgba(0, 0, 0, 0) !important;
	}
</style>
